import { createRouter, createWebHistory, createWebHashHistory } from "vue-router";

// 创建路由规则
const routes = [
    {
        path: "/",
        // alias: "/home", // 别名
        alias: ["/home", "/index"], // 可以定义多个别名
        component: ()=> import("@/views/index.vue") // 导入对应组件
    },
    {
        path: "/content",
        component: ()=> import("@/views/content.vue")
    },
    {
        name: "member", // 路由名称
        path: "/user/:id/name/:name?",
        component: ()=> import("@/views/user.vue")
    },
    {
        path: "/vip", // http://localhost:5173/vip
        component: ()=> import("@/views/vip.vue"), // 在父视图中需要加载子视图，子视图才能够渲染
        children: [ // 嵌套路由，子路由
            {
                path: "order", // http://localhost:5173/vip/order
                component: ()=>import("@/views/vip/order.vue")
            },
            {
                path: "info", // http://localhost:5173/vip/info
                component: ()=>import("@/views/vip/info.vue")
            },
            {
                path: "", // http://localhost:5173/vip/default
                component: ()=>import("@/views/vip/default.vue")
            }
            
        ]
    },
    {
        path: "/svip", // 重定向路由，重定向后地址会直接跳到重定向后的路由
        redirect: "/vip"
    },
    {
        path: "/sindex", // 重定向路由，动态属性绑定对象
        redirect: {name: 'member', params: {id:1005, name: 'laoda'}}
    }
]

// 创建路由
const router = createRouter({
    // history: createWebHistory(),
    // 使用 url 的 # 号之后的部分模拟 url 路径的变化，因为不会触发页面刷新，所以不需要服务端支持
    history: createWebHashHistory(),
    routes
})
// 导出路由
export default router;